﻿@model IEnumerable<UPMS.Core.Domain.Organization>

@{
    ViewBag.Title = "Index";
}
<section class="panel panel-default">

    <header class="panel-heading"> @ViewBag.Title </header>
    <div class="row text-sm wrapper">
        <div class="col-sm-5 m-b-xs">
            <button class="btn btn-sm btn-danger" data-toggle="modal" id="btnCreateNew">
                <i class="fa fa-plus text"></i><span class="text"> Create New</span>
            </button>
        </div>
        <div class="col-sm-4 m-b-xs">
            <select class="input-sm form-control input-s-sm inline">
                <option value="0">Bulk action</option>
                <option value="1">Delete selected</option>
                <option value="2">Bulk edit</option>
                <option value="3">Export</option>
            </select>
            <button class="btn btn-sm btn-default">Apply</button>
            <div class="btn-group" data-toggle="buttons">
                <label class="btn btn-sm btn-default active"> <input type="radio" name="options" id="option1"> Day </label>
                <label class="btn btn-sm btn-default"> <input type="radio" name="options" id="option2"> Week </label>
                <label class="btn btn-sm btn-default"> <input type="radio" name="options" id="option2"> Month </label>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="input-group">
                <input type="text" class="input-sm form-control" placeholder="Search">
                <span class="input-group-btn"> <button class="btn btn-sm btn-default" type="button">Go!</button> </span>
            </div>
        </div>
    </div>
    <div class="table-responsive">
        <table class="table table-striped b-t b-light text-sm">
            <thead>
                <tr>
                    <th>
                        <input type="checkbox" />
                        @Html.AntiForgeryToken()
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.Name)
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.Description)
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.Created)
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.CreatedBy)
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.Modified)
                    </th>
                    <th>
                        @Html.DisplayNameFor(model => model.ModifiedBy)
                    </th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                @foreach (var item in Model)
                {
                    <tr>
                        <td>
                            <input type="checkbox" name="org_@item.Id" id="org_@item.Id" value="@item.Id">
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.Name)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.Description)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.Created)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.CreatedBy)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.Modified)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.ModifiedBy)
                        </td>
                        <td>

                            <a class="btn btn-sm btn-icon btn-info" rel="edit" data-id="@item.Id" href="#javascript:void(0);"><i class="fa fa-edit"></i></a>
                            <a class="btn btn-sm btn-icon btn-success" rel="view" data-id="@item.Id" href="#javascript:void(0);"><i class="fa fa-folder-open"></i></a>
                            <a class="btn btn-sm btn-icon btn-danger" rel="delete" data-id="@item.Id" href="#javascript:void(0);"><i class="fa fa-times"></i></a>


                            @*@Html.ActionLink("Edit", "Edit", new { id = item.Id }) |
                                @Html.ActionLink("Details", "Details", new { id = item.Id }) |
                                @Html.ActionLink("Delete", "Delete", new { id = item.Id })*@
                        </td>
                    </tr>
                }
            </tbody>
        </table>
    </div>
    <footer class="panel-footer">
        <div class="row">
            <div class="col-sm-4 hidden-xs">
                <select class="input-sm form-control input-s-sm inline">
                    <option value="0">Bulk action</option>
                    <option value="1">Delete selected</option>
                    <option value="2">Bulk edit</option>
                    <option value="3">Export</option>
                </select> <button class="btn btn-sm btn-default">Apply</button>
            </div> <div class="col-sm-4 text-center">
                <small class="text-muted inline m-t-sm m-b-sm">showing 20-30 of 50 items</small>
            </div> <div class="col-sm-4 text-right text-center-xs">
                <ul class="pagination pagination-sm m-t-none m-b-none">
                    <li><a href="#"><i class="fa fa-chevron-left"></i></a></li>
                    <li><a href="#">1</a></li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                    <li><a href="#">5</a></li>
                    <li><a href="#"><i class="fa fa-chevron-right"></i></a></li>
                </ul>
            </div>
        </div>
    </footer>
</section>
@section scripts{
    <script>
        $(function () {

            $("a.btn[rel='delete']").each(function () {
                $(this).on("click.delete", function (e) {

                    var id = $(this).data("id");


                    bootbox.dialog({
                        message: "Are you sure you want to delete the item('" + id + "')",
                        title: "Custom title",
                        buttons: {
                            yes: {
                                label: "&nbsp; &nbsp; &nbsp; &nbsp; Yes &nbsp; &nbsp; &nbsp; &nbsp;",
                                className: "btn-sm btn-danger",
                                callback: function () {
                                    $.ajax({
                                        url: '/Organization/Delete/id',
                                        type: 'Post',
                                        data: {
                                            "__RequestVerificationToken": $('input[name="__RequestVerificationToken"]').val(),
                                            id: id
                                        },
                                        success: function (d) {

                                        },
                                        error: function (e) { }
                                    });

                                    return false;
                                }
                            },
                            no: {
                                label: "&nbsp; &nbsp; &nbsp; &nbsp; No &nbsp; &nbsp; &nbsp; &nbsp;",
                                className: "btn-sm btn-default",
                                callback: function () {

                                }
                            }
                        }
                    });
                });
            });
        });
    </script>
}